import React, {ReactElement} from 'react';
import {Form} from "antd";
import {FormInstance} from "antd/es/form/hooks/useForm";
import {QueryFilter} from "@ant-design/pro-components";
import RcResizeObserver from 'rc-resize-observer';
import './index.less';
import {BaseQueryFilterProps} from "@ant-design/pro-form/es/layouts/QueryFilter";


interface SearchFormProps extends BaseQueryFilterProps {
    form: FormInstance,
    children: ReactElement<typeof Form.Item>[] | ReactElement<typeof Form.Item>,
    onFinish?: () => void,
    onReset?: () => void,
    onResize?: () => void,
}

const SearchForm: React.FC<SearchFormProps> = ({form, children, onFinish, onReset, onResize, ...searchFormProps}) => {

    return <RcResizeObserver onResize={() => onResize && onResize()}>
        <QueryFilter form={form} onReset={() => onReset && onReset()}
                     onFinish={async () => onFinish && onFinish()} {...searchFormProps} >
            {children}
        </QueryFilter>
    </RcResizeObserver>
};

export default SearchForm;
